<template lang="pug">
  .union
    group(v-if="!hasUnion")
      cell(title="创建公会" is-link value-align="left" link="/createUnion")
          img(slot="icon" width="40" style="display:block;margin-right:5px;" :src="user.avatar")          
    div.has-union(v-if="hasUnion")
      //- group
      cell.user(primary="content" value-align="left") 
        img(slot="icon" width="80" style="display:block;margin-right:5px;" :src="user.avatar")
        div(title="value")
          .nickname {{user.nickname}}
          .card-beans
            span.beans {{user.points}}
      group
        cell(title="工会信息" value-align="left" is-link :arrow-direction="!isNotCollpose ? 'down':'up'" @click.native="collpose")
          img(slot="icon" width="20" style="display:block;margin-right:5px;" src="../assets/o_orgInfo1.png")
        template(v-if="isNotCollpose")
          cell.union-info(title="工会名称" value-align="left" )  
            div.tar {{unionInfo.name}}          
          cell.union-info(title="公会号" value-align="left" :value="unionInfo.oid")
            div.tar {{unionInfo.oid}} 
          cell.union-info(title="创建时间" value-align="left" :value="unionInfo.addtime")
            div.tar {{unionInfo.addtime}} 
          cell.union-info(title="会长" value-align="left" )
            div.tar
              img.chairmanIcon(:src="unionInfo.avatar")
              span {{unionInfo.nickname}}
        cell(title="工会动态" is-link value-align="left" link="/uniondongtai")
          img(slot="icon" width="20" style="display:block;margin-right:5px;" src="../assets/o_orgInfo1.png")
        cell(title="我的欢乐豆" is-link value-align="left" link="/beansUseDetail")
          img(slot="icon" width="20" style="display:block;margin-right:5px;" src="../assets/o_beanDetail1.png")
        cell(title="消耗设置" is-link value-align="left" link="/usefate")
          img(slot="icon" width="20" style="display:block;margin-right:5px;" src="../assets/o_gameList1.png")
      group()
        cell(title="成员列表" value-align="left" is-link link="/members" )
          img(slot="icon" width="20" style="display:block;margin-right:5px;" src="../assets/o_memberList1.png")
          .members (1/2000)
            badge 1   
        
        cell(title="邀请函" is-link value-align="left" @click.native="invite")
          img(slot="icon" width="20" style="display:block;margin-right:5px;" src="../assets/o_invitation1.png")
        cell(title="分销系统" is-link value-align="left" link="/fenxiao")
          img(slot="icon" width="20" style="display:block;margin-right:5px;" src="../assets/fenxiao.png")
      group
        cell(title="俱乐部大厅" is-link value-align="left" link="/createUnion")
          img(slot="icon" width="20" style="display:block;margin-right:5px;" src="../assets/o_createOrg1.png")
        cell(title="退出工会" is-link value-align="left" @click.native="exitGuild")
          img(slot="icon" width="20" style="display:block;margin-right:5px;" src="../assets/o_quitOrg1.png")
</template>

<script>
import router from 'vue-router'
import memberService from '@/api/member'

export default {
  name: 'union',
  created () {
    this.getUnionInfo()
  },
  props:['user'],
  data () {
    return {
      hasUnion: true,
      unionInfo: {
        
      },
      isNotCollpose: false
    }
  },
  methods: {
    creatUnion () {
      router.push('createUnion')
    },
    collpose () {
      this.isNotCollpose = !this.isNotCollpose
    },
   
    getUnionInfo () {
      memberService.GuildInfo()
        .then(res => {
          if(res.status === 0){
            this.hasUnion = false
          }else{
            this.unionInfo = res.result
          }
        })
    },
    exitGuild () {
      const that = this
      this.$vux.confirm.show({
        title: '确认退出公会?',
        onConfirm () {
          memberService.ExitGuild()
            .then(res => {
              that.$vux.alert.show({
                title: '退出公会成功',
                onHide () {
                  console.log('onHide')
                }
              })
            })
        }
      })
    },
    invite(){
      // debugger
      this.$vux.alert.show({
        title: '邀请好友',
        content:'请点击微信右上角分享按钮，分享游戏给您的好友',
        onHide () {
          
        }
      })
    }
  }

}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang="less">
.union{
  height: 100%;
  position: absolute;
  width: 100%;
  overflow-y: auto;
  // top: -24px;
  padding-bottom:41px;  
  .user{
    background-color: #fff;
  }
  .tar{
    text-align: right;
  }
  .chairmanIcon{
    width:20px;
    height: 20px;
  }
  .union-info{    
    padding-left: 40px;
  };
  .beans{
    text-align: center;
  }
}
</style>
